<template>
  <div id="staff">
    <div id="content">
      <el-breadcrumb separator="/">
        <el-breadcrumb-item>系统设置</el-breadcrumb-item>
        <el-breadcrumb-item>员工管理</el-breadcrumb-item>
      </el-breadcrumb>

      <div class="xcx-content">

        <el-row class="add_employee">
          <el-col>
            <el-button @click="add" type="primary">添加员工</el-button>
          </el-col>
        </el-row>

        <el-table :data="tableData.slice((page-1)*limit,page*limit)" style="width: 100%;">
          <el-table-column prop="username" label="员工账号">
          </el-table-column>
          <el-table-column prop="username" label="姓名">
          </el-table-column>
          <el-table-column prop="mobile" label="手机号码">
          </el-table-column>
          <el-table-column prop="register_time" label="添加时间">
          </el-table-column>
          <el-table-column prop="role_name" label="员工权限">
          </el-table-column>
          <el-table-column prop="operation" label="操作">
            <template slot-scope="scope">
              <div v-if="user_id !== scope.row.encode_id" >
                <el-button @click="edit(scope.row.id)" type="text" class="font14" size="small">编辑</el-button>
                <el-button type="text" @click="deleteUser(scope.row.id)" class="font14" size="small">
                  <span style="color: red">删除</span>
                </el-button>
              </div>
              <div v-else>
                当前账号
              </div>
            </template>
          </el-table-column>
        </el-table>
        <div class="block">
          <span class="demonstration">共 {{ count }}条</span>
          <el-pagination @current-change="handleCurrentChange" background layout="prev, pager, next" :total="count"></el-pagination>
        </div>
      </div>
    </div>
  </div>
</template>

<script type="text/javascript" src="../../../static/js/employee/employee_list.js">
</script>

<style scoped>
@import "../../../static/css/employee/employee_list.css";
</style>